<template>
  <component
    :is="tag"
    ref="barcodeRef"
  />
</template>

<script setup>
import JsBarcode from 'jsbarcode'

const props = defineProps({
  text: {
    type: String,
    default: null,
  },
  tag: {
    type: String,
    default: 'canvas',
  },
  options: {
    type: Object,
    default: () => ({}),
  },
  type: {
    type: String,
    default: 'CODE128',
  },
})

const barcodeRef = ref(null)

onMounted(() => {
  const p = props
  JsBarcode(barcodeRef.value, p.text, { ...p.options, format: p.type })
})
</script>
